<template>
  <div class="content">
    <li v-for="v in arr" :key="v.creativeId">
      <img :src="v.uiElement.image.imageUrl" alt="" />
      <p>{{ v.uiElement.mainTitle.title }}</p>
    </li>
  </div>
</template>

<script>
export default {
  props: ["arr"],
};
</script>

<style lang="less" scoped>
.content {
  display: flex;
  overflow: auto;
  width: 100%;
  li {
    margin: 0 0.18rem 0 0;
    img {
      box-sizing: border-box;
      width: 2.11rem;
      height: 2.11rem;
      border-radius: 0.15rem;
      background-color: pink;
      border: 0.01rem solid #ececec;
    }
    p {
      width: 1.98rem;
      font-size: 0.2rem;
    }
  }
}
</style>